<template>
  <div>
    <el-dialog
      title="编辑用户"
      :visible.sync="centerDialogVisibleUserEdit"
      :close-on-click-modal="false"
      width="40%"
      center
    >
      <el-form
        ref="ruleFormUserEdit"
        :model="ruleFormUserEdit"
        :rules="rulesUserEdit"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="用户名称:" prop="sysUserName">
          <el-input v-model="ruleFormUserEdit.sysUserName" />
        </el-form-item>
        <el-form-item label="账号:" prop="sysUserLoginName">
          <el-input v-model="ruleFormUserEdit.sysUserLoginName" :disabled="true" />
        </el-form-item>
        <el-form-item label="账号登录次数" prop="sysLoginNumber">
          <el-input-number v-model="ruleFormUserEdit.sysLoginNumber" :min="-1" @change="handleChange" />
        </el-form-item>
        <el-form-item label="手机号:" prop="sysUserPhone">
          <el-input v-model="ruleFormUserEdit.sysUserPhone" />
        </el-form-item>
        <el-form-item prop="sysUserEmail" label="邮箱">
          <el-input v-model="ruleFormUserEdit.sysUserEmail" />
        </el-form-item>
        <el-form-item label="状态" prop="isForbidden">
          <el-radio-group v-model="ruleFormUserEdit.isForbidden">
            <el-radio label="0">已启用</el-radio>
            <el-radio label="1">已禁用</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="submitFormUserEdit('ruleFormUserEdit')">确认编辑</el-button>
          <el-button @click="resetFormUserEdit('ruleFormUserEdit')">重置</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import User from '@/api/axios/api/author/user'
import Tip from '@/utils/tip'

export default {
  name: 'AuthUserEdit',
  props: {
    userEdit: {}
  },
  data() {
    return {
      centerDialogVisibleUserEdit: false,
      ruleFormUserEdit: {
        sysUserName: '',
        sysUserLoginName: '',
        sysUserPhone: '',
        sysUserEmail: '',
        sysLoginNumber: 1,
        isForbidden: '1',
        date1: '',
        date2: '',
        delivery: false,
        type: [],
        resource: '',
        desc: ''
      },
      rulesUserEdit: {
        sysUserName: [
          { required: true, message: '请输入用户名称', trigger: 'blur' }
        ],
        sysUserLoginName: [
          { required: true, message: '请输入登录账号', trigger: 'blur' }
        ],
        sysUserPhone: [
          { required: true, message: '请输入手机号', trigger: 'blur' }
        ],
        sysUserEmail: [
          { required: true, message: '请输入邮箱', trigger: 'blur' }
        ],
        email: [
          { required: true, message: '请输入邮箱地址', trigger: 'blur' },
          { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }
        ]
      }
    }
  },
  watch: {
    userEdit: {
      deep: true,
      immediate: false,
      handler() {
        this.centerDialogVisibleUserEdit = this.userEdit.centerDialogVisibleUserEdit
        this.ruleFormUserEdit = JSON.parse(JSON.stringify(this.userEdit.userInfo))
      }
    }
  },
  methods: {
    handleChange(value) {
    },
    submitFormUserEdit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          User.userModify(this.ruleFormUserEdit).then(res => {
            Tip.success(res.data)
            setTimeout(() => {
              this.$emit('centerDialogVisibleUserEdit', false)
            }, 2000)
          })
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    resetFormUserEdit(formName) {
      this.$refs[formName].resetFields()
    }
  }
}
</script>

<style scoped>

</style>
